﻿<DemoPageSectionComponent Id="DataGrid-Summary-Group" ShowHorizontalScrollBar="true">
    @inject NwindDataService NwindDataService

    @if(Data == null) {
        <p><em>Loading...</em></p>
    } else {
        <DxDataGrid Data="@Data" ShowGroupPanel="true">
            <Columns>
                <DxDataGridColumn Field="@nameof(Invoice.Country)" GroupIndex="0" Width="200px" />
                <DxDataGridColumn Field="@nameof(Invoice.City)" GroupIndex="1" Width="200px" />
                <DxDataGridColumn Field="@nameof(Invoice.CustomerName)" />
                <DxDataGridSpinEditColumn Field="@nameof(Invoice.UnitPrice)" DisplayFormat="c" Width="120px" />
                <DxDataGridSpinEditColumn Field="@nameof(Invoice.Quantity)" Width="120px" />
            </Columns>
            <GroupSummary>
                <DxDataGridSummaryItem SummaryType="SummaryItemType.Count" Field="@nameof(Invoice.CustomerName)" DisplayFormat="Count is {0}" />
                <DxDataGridSummaryItem SummaryType="SummaryItemType.Avg" Field="@nameof(Invoice.Quantity)" DisplayFormat="Avg of Quantity is {0:0.##}" />
            </GroupSummary>
        </DxDataGrid>
    }

    @code {
        IEnumerable<Invoice> Data { get; set; }

        protected override async Task OnInitializedAsync() {
            Data = await NwindDataService.GetInvoicesAsync();
        }
    }
</DemoPageSectionComponent>
